// Goods target height , assume the goods is a square
window.GOODS_ANIMATION_MAX_WIDTH = 105;

/**
 * Define the Position class to store the X,Y value
 */
var Position = function(x, y) {
	this.x = x;
	this.y = y;
};

/**
 * Define the goods class.
 * 
 * @param id
 * @param type
 * @returns
 */
var Goods = function(obj) {
	this.obj = obj;
	this.id = this.obj.attr("id");
	this.type = this.obj.attr("goodsType");
};
/**
 * Define a lattice object .
 * 
 * @param obj
 * @returns
 */
var Lattice = function(obj) {
	this.obj = obj;
	this.id = this.obj.attr("id");
};

/**
 * Define a animation utility Class.
 */
var AnimationUtil = {
	/**
	 * Get the goods center position relative to the lattice store this goods.
	 * 
	 * @param event
	 */
	getGoodsCenterPosition : function(e) {
		var w = $(window);
		var ww = w.width(), wh = w.height(), sl = w.scrollLeft(), st = w.scrollTop(), ex = e.pageX, ey = e.pageY;
		// page entire width and height
		var pageHeight = wh + st, pageWidth = ww + sl;
		// the lattice screen Y position (consider window top = 0 , left = 0)
		var latticeScreenY = wh - (pageHeight - ey), latticeScreenX = ww - (pageWidth - ex);
		// the goods screen X,Y relative to the lattice
		var goodsScreenY = wh / 2 - latticeScreenY - GOODS_ANIMATION_MAX_WIDTH;
		var goodsScreenX = ww / 2 - latticeScreenX - GOODS_ANIMATION_MAX_WIDTH / 2;
		return new Position(goodsScreenX, goodsScreenY);
	},

	/**
	 * Get the goods type.
	 */
	getGoods : function(e) {
		var latticeId = "#" + e.target.id;
		// the goods object
		return new Goods($(latticeId + " > img.goods"));
	},

	getLattice : function(e) {
		var latticeId = "#" + e.target.id;
		// the lattice jQuery object
		return new Lattice($(latticeId));
	}
};

/**
 * Define a animation handler for centralize the animation handle.
 */
var AnimationHandler = {
	/**
	 * Fire the animation.
	 * 
	 * @param event
	 */
	fireAnimation : function(e) {
		var goods = AnimationUtil.getGoods(e);
		$.each(AnimationSettings[goods.type], function(index, animation) {
			setTimeout(function() {
				Animations[animation["name"]](e);
			}, animation["delay"]);
		});
	}
};

/**
 * Setting the animation for each type of goods.
 */
var AnimationSettings = {
	// animate define for diamond type goods
	"diamond" : [ {
		"name" : "progressivePop",
		"delay" : 0
	}, {
		"name" : "progressiveMinify",
		"delay" : 1500
	} ],

	// animate define for bomb type goods
	"bomb" : [ {
		"name" : "progressivePop",
		"delay" : 0
	}, {
		"name" : "shocking",
		"delay" : 1500
	}, {
		"name" : "transparency",
		"delay" : 1500
	} ]

};

/**
 * All animations definition.
 */
var Animations = {
	/**
	 * Play the animation when user click the masked goods.
	 * 
	 * @param e
	 */
	progressivePop : function(e) {
		var goodsCenterPosition = AnimationUtil.getGoodsCenterPosition(e);
		// the lattice jQuery object
		var lattice = AnimationUtil.getLattice(e).obj;
		// the goods object
		var goods = AnimationUtil.getGoods(e).obj;

		// hide lattice
		lattice.animate({
			"height" : "0px",
			"width" : "0px"
		}, 120, function() {
			// unbind the click action .
			lattice.unbind("click");
			// goods css
			goods.css({
				"display" : "",
				"position" : "relative"
			});
			// goods animation
			goods.animate({
				"height" : GOODS_ANIMATION_MAX_WIDTH + "px",
				"left" : goodsCenterPosition.x + "px",
				"top" : goodsCenterPosition.y + "px"
			}, 350);
		});
	},

	/**
	 * progressive minify
	 * 
	 * @param e
	 */
	progressiveMinify : function(e) {
		var target = AnimationUtil.getGoods(e).obj;
		// goods animation
		target.animate({
			"height" : "0px",
			"left" : ($(window).width() / 2) + "px",
			"top" : "0px"
		}, 350, function() {
			target.css({
				"display" : "none",
				"position" : "relative"
			});
		});
	},

	/**
	 * Transparency
	 */
	transparency : function(e) {
		var goods = AnimationUtil.getGoods(e);
		goods.obj.animate({
			"opacity" : 0
		}, 50);
	},

	/**
	 * Shocking
	 * 
	 * @param e
	 */
	shocking : function(e) {
		var goods = AnimationUtil.getGoods(e);
		var shockMaxOffset = 4;

		var shockPosition = [ 'top', 'left' ], count = 0;
		shockIntervalObject = setInterval(function() {
			var randomPosition = shockPosition[count % 2];
			var shockOffset = (count++) % shockMaxOffset < 2 ? 0 : shockMaxOffset;
			var goodsCenterPosition = AnimationUtil.getGoodsCenterPosition(e);
			if (randomPosition == 'top') {
				shockOffset += goodsCenterPosition.y;
			} else {
				shockOffset += goodsCenterPosition.x;
			}
			goods.obj.css(randomPosition, shockOffset);
			// document.getElementById(id).style[randomPosition] = shockAmount;
			if (count > 35) {
				clearInterval(shockIntervalObject);
				count = 0;
			}
		}, 32);
	},

	/**
	 * @param e
	 */
	explode : function(e) {
	}

};